<template>
  <div class="h-screen">
    <swiper-container ref="swiperContainer" v-bind="findProps" class="w-full h-screen">
      <swiper-slide>
        <img src="/B1.jpg" class="img-fiuld"/>
      </swiper-slide>
      <swiper-slide>
        <img src="/B2.webp" class="img-fiuld"/>
      </swiper-slide>
      <swiper-slide>
        <img src="/B3.jpg" class="img-fiuld"/>
      </swiper-slide>
    </swiper-container>
  </div>
</template>

<script setup lang="ts">
import { type SwiperOptions } from 'swiper/types';

import { register } from 'swiper/element/bundle';
const swiperContainer = ref(null);
onMounted(() => {
  register();
});

const findProps: SwiperOptions = {
  autoplay: {
    delay: 5000,
    disableOnInteraction: false,
  },
  loop: true,
};
</script>

<style lang="scss" scoped>
</style>
